<template>
    <div class="box">
        <div class="top">
            <span>退货商品</span>
            <el-table :data="tableData" style="width: 100%" border >
                <el-table-column prop="date" label="商品图片" align="center" width="180" />
                <el-table-column prop="name" label="商品名称" align="center" width="180" />
                <el-table-column prop="name" label="价格/货号" align="center" />
                <el-table-column prop="name" label="属性" align="center" />
                <el-table-column prop="name" label="数量" align="center" />
                <el-table-column prop="name" label="小计" align="center" />
            </el-table>
            <div class="Price">
                <span>总价：</span>
                <span>￥888</span>
            </div>
        </div>
        <div class="bottom">
            服务单信息
            
        </div>
    </div>
</template>

<script setup lang="ts">
import { user } from '@/api';
import { useRoute } from 'vue-router';

const route = useRoute()

if (route.query.id) {
  // 保证两三个请求都要成功
  Promise.all([
    user.getApplyApi(parseInt(route.query.id as string)),
    user.getcompanyAddressApi(),
  ]).then(([res1, res2]) => {
    console.log('res1**',res1);
    console.log('res2**',res2);
  })
}

const tableData = [
  {
    date: '2016-05-03',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  }
]

</script>

<style lang="less" scoped>
.box{
    margin: 50px auto;
    width: 1080px;
}
.top{
    padding: 20px;
    border: 1px solid #ebeef5;
    border-radius: 3px;
    margin-bottom: 10px;
    overflow: hidden;
    .Price{
        margin-top: 15px;
        float: right;
    }
}
.bottom{
    padding: 20px;
    border: 1px solid #ebeef5;
    border-radius: 3px;
}
</style>